<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图片展示</title>
<script src="../js/pub-lib/jquery/jquery-1.9.1.min.js"></script>
<script src="../js/pub-lib/bootstrap/js/bootstrap.min.js"></script> 
<script type="text/javascript" src="../js/pub-lib/jquery/jQueryRotate.js"></script>
<script type="text/javascript" src="../js/pub-lib/jquery/jquery.jqprint-0.3.js"></script>
<script type="text/javascript" src="../js/pub-lib/jquery/jquery-migrate-1.2.1.js"></script>
<link rel="stylesheet" type="text/css" href="../css/pub-lib/bootstrap.min.css"></link>
<link rel="stylesheet" type="text/css" href="../css/mystyle.css"></link>

<script type="text/javascript">
var fileName = "<%=request.getAttribute("fileName")%>";
var filePath = "<%=request.getAttribute("filePath")%>";
$(function(){
	//加载
	$("#title").html(fileName+"[注意：单击图片可旋转,双击图片可打印]");
	$("#imgId").attr('src',"/etfiles/uploadimgs/"+filePath) ;
	
	if($('.img_show img').complete) {
		$('.img_show img').css({'left':($(document).width()-$('.img_show img').width())/2+'px'});
	}
	$('.img_show img').load(function () { 
		$('.img_show img').css({'left':($(document).width()-$('.img_show img').width())/2+'px'});
	});
	$(window).resize(function() {
		$('.img_show img').css({'left':($(document).width()-$('.img_show img').width())/2+'px'});
	});
	
	//图片打印//图片旋转
	//点击翻转,顺时针
	$(".img_show").find("img").each(function(){
		var val = 0;
		var image = $(this);
//		 $(image).click(function(){
//			 val += 90;
//			 $(this).rotate({
//			   animateTo: val
//			 });
//		 })
		var _time = null;

		$(image).dblclick(function(){
			clearTimeout(_time);                

            $(image).jqprint();	 
		  	
		}).click(function(e){
            clearTimeout(_time);
            _time = setTimeout(function(){
                //单击事件在这里 传递$(this)不是本对象
				 val += 90;
				 $(image).rotate({
				   animateTo: val
				 });
            }, 300);
        });
	});	
});
</script>
</head>
<body style="background: #eee;">
	<div class="img_show">
		<h3 id="title"></h3>
		<img id="imgId" src="" />
	</div>
</body>
</html>
